<!doctype html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <th:block th:include="/A0723/include :: header('个人资料')"/>
</head>

<body>
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">个人资料</h1>
</header>
<div class="mui-content">
    <div class="forget_from">
        <div class="mui-input-row">
            <label>手机号：</label>
            <input type="text" id="phone" readonly value="" disabled="disableds">
        </div>
        <div class="mui-input-row">
            <label>开户名称：</label>
            <input type="text" id="accountName" value="">
        </div>
        <div class="mui-input-row">
            <label>开户银行：</label>
            <input type="text" id="bankAccount" value="12345678987">
        </div>
        <div class="mui-input-row">
            <label>银行卡号：</label>
            <input type="text" id="bankCard" value="12345678987">
        </div>
        <div class="mui-input-row">
            <label>钱包地址：</label>
            <input type="text" data-clipboard-action="copy" data-clipboard-text="#usdtAddress" class="btn" id="usdtAddress" value="">
        </div>
        <div class="mui-input-row">
            <label>支付宝收款码：</label>

            <div class="file">
                <input id="alipayPaymentCode" type="hidden">
                <input type="file" onchange="readFile(this,'#alipayPaymentCode','#preview-alipay')" />
                <img class="preview-img" id="preview-alipay" src="images/up.png" alt="">
            </div>

        </div>
        <div class="mui-input-row">
            <label>微信收款码：</label>
            <div class="file">
                <input id="wechatPaymentCode" type="hidden">
                <input type="file" onchange="readFile(this,'#wechatPaymentCode','#preview-wechat')" />
                <img class="preview-img"  id="preview-wechat"  src="images/up.png" alt="">
            </div>

        </div>
        <button type="button" onclick="editProfile()" class="mui-btn mui-btn-blue mui-btn-block mui_btn">保存</button>
    </div>
</div>
<th:block th:include="/A0723/include :: footer"/>
<th:block th:include="/A0723/include :: common"/>
<script th:src="@{/front/js/dist/clipboard.min.js}"></script>
<script type="text/javascript">

    let data = {}
    $(function () {
        getAppUserProfile()
    })
    let code = ''
    var clipboard = new ClipboardJS('.btn', {
        text: function () {
            return code;
        }
    });
    clipboard.on('success', function (e) {
        console.info('Action:', e.action);
        console.info('Text:', e.text);
        console.info('Trigger:', e.trigger);
        mui.toast('已复制', {duration: 'long', type: 'div'})
    });

    /**
     * 获取会员收款资料
     */
    function getAppUserProfile() {
        mui.ajax(ctx+'front/getAppUserProfile', {
            dataType: 'json',//服务器返回json格式数据
            type: 'get',//HTTP请求类型
            timeout: 10000,//超时时间设置为10秒；
            headers: {'Content-Type': 'application/json'},
            success: function (res) {
                if (res.code === 0) {
                    let data = res.data;
                    $("#accountName").val(data.accountName);
                    $("#phone").val(data.phone);
                    $("#bankAccount").val(data.bankAccount);
                    $("#bankCard").val(data.bankCard);
                    $("#usdtAddress").val(data.usdtAddress);
                    code = data.usdtAddress
                    $("#alipayPaymentCode").val(data.alipayPaymentCode);
                    $("#preview-alipay").attr('src',data.alipayPaymentCode==null?'images/up.png':data.alipayPaymentCode);
                    $("#wechatPaymentCode").val(data.wechatPaymentCode);
                     $("#preview-wechat").attr('src',data.wechatPaymentCode==null?'images/up.png':data.wechatPaymentCode);
                } else {
                    mui.toast(res.msg, {duration: 'long', type: 'div'})
                }

            },
            error: function (xhr, type, errorThrown) {
                //异常处理；
                console.log(type);
            }
        });
    }

    //验证
    function validateProfile() {

        let accountName = $("#accountName").val();
        if (accountName == null || accountName === '') {
            mui.toast('请输入开户名称', {duration: 'long', type: 'div'})
            return
        }
        let bankAccount = $("#bankAccount").val();
        if (bankAccount == null || bankAccount === '') {
            mui.toast('请输入开户银行', {duration: 'long', type: 'div'})
            return
        }

        let bankCard = $("#bankCard").val();
        if (bankCard == null || bankCard === '') {
            mui.toast('请输入银行卡号', {duration: 'long', type: 'div'})
            return
        }
        let usdtAddress = $("#usdtAddress").val();
        if (usdtAddress == null || usdtAddress === '') {
            mui.toast('请输入usdt地址', {duration: 'long', type: 'div'})
            return
        }
        let alipayPaymentCode = $("#alipayPaymentCode").val();

        if (alipayPaymentCode == null || alipayPaymentCode === '') {
            mui.toast('请输入支付宝收款码', {duration: 'long', type: 'div'})
            return
        }
        let wechatPaymentCode = $("#wechatPaymentCode").val();
        if (wechatPaymentCode == null || wechatPaymentCode === '') {
            mui.toast('请输入微信收款码', {duration: 'long', type: 'div'})
            return
        }
        data.accountName = accountName;
        data.bankAccount = bankAccount;
        data.bankCard = bankCard;
        data.usdtAddress = usdtAddress;
        data.alipayPaymentCode = alipayPaymentCode;
        data.wechatPaymentCode = wechatPaymentCode;
        return true;
    }

    /**
     * 修改会员收款资料
     */
    function editProfile() {
        if (validateProfile()) {
            mui.ajax(ctx+'front/personal/profile', {
                data: data,
                dataType: 'json',//服务器返回json格式数据
                type: 'post',//HTTP请求类型
                timeout: 10000,//超时时间设置为10秒；
                headers: {'Content-Type': 'application/json'},
                success: function (res) {
                    mui.toast(res.msg, {duration: 'long', type: 'div'})
                    setInterval(function () {
                        window.location.reload()
                    },3000)
                },
                error: function (xhr, type, errorThrown) {
                    //异常处理；
                    console.log(type);
                }
            });
        }

    }
</script>
</body>

</html>
